Sephora's Beauty Talk Community

Sephora Beauty Talk is a pre-existing community platform utilized to engage customers that are loyal to beauty products and can provide reviews as well as influence other buyers. Lithium is an an out of box solution that helps brands connect with real product users and build customer engagement while delivering social media marketing.

Sephora Beauty Talk – Community platform

— Project scope

Redesign

Overhaul


— Contract Role

Research

Wireframes

UI/UX


— Duration

 6 months contract


The Problem:

The Sephora community is outdated and lacked a mobile experience. Social marketing opportunities were being missed and user engagement was decreasing.


Key Goals:

  1. • Increase user engagement and grow community

• Design for scale and curated content placement

• Overhaul the Sephora community



Responsibility:

  • Review existing user research 
  • Lead the content re-design/overhaul
  • Propose a solution strategy for component and content placements
  • Design responsive content for mobile experience
  • Deliver prototypes for user testing

 

The context

Users discover Sephora’s community when shopping via their online store. The community is a forum of interest for users interested in beauty topics. Users usually browse for answers or questions, beauty advice, inspiration or contribute to beauty conversations.

Key business problem focus

01 /

Poor mobile experience

The Sephora mobile app does not have proper access to the community experience. The community website is not responsive. Makes it difficult to post content with images etc.


02 /

Content placement

The current content layout has little hierarchy and is difficult to digest. Photos are too small actions are not prominent.


03 /

Not leveraging social media enough

Poor mobile experience

The community is missing many social media features that users are used to from using other social platforms 


04 /

Incomplete data tracking

The community platform is outdated and valuable data is not being tracked. These insights would be beneficial to help with Sephora’s marketing strategy


The approach



Summary:

To kick off the project I did a complete walk-thru of the community experience. The walk-thru/assessment along with existing documented insight form the Sephora marketing team helped me understand the user base and detect usability issues that may occur when users interact with the community. The Lithium team and myself met several times with the Sephora marketing team. During these sessions I shared concepts and received feedback from the Sephora team. Most of my responsibility was to ensure that the design and content was laid out to cater to Lithium’s out of box solution and Sephora’s users and business needs. I worked closely with a project manager, engineer and Sephora marketing team to validate direction and implement a feasible mobile and web experience.


Research:

  1. Walk-thru/Heuristic evaluation of Sephora's community experience
  2. Review goals, personas, research and documented insights from the Sephora marketing team
  3. Become familiar with Lithium's suite out of box components/ solutions
  4. Scan other communities for inspiration, trends, patterns, popularity, layouts etc.


Design:

Wireframes and design review sessions with the Sephora and Lithium team to ensure that the design and content was laid out to cater to Lithium’s out of box solution and Sephora’s users and business needs

Feature planning

‍After setting up the product goals and deciding what features to include. Feature planning helped figure out what components can be used. It also helps visualize the relationship between the content and examine the hierarchy.


This section highlights the pages with most traffic.

Inspiration

Features to support


All features considered for Desktop and mobile experiences using Lithium’s out of box solution. Features are based on user research and business goals.

Content placement

re-design

How can we approach the re-design?

• Strategically place & layout content to highlight aspects of posts that will engage users

• Place and layout content to highlight aspects of a post that will result in engagement

  • • Build components that are responsive to help cover multiple use cases, especially mobile
  • • Show recommended relatable content to the user



There was a strong focus on designing a solution that would work  across devices

Wireframes for conversation design that works for mobile and desktop 

Simple content layout exercises helped figured out how to best layout content for desktop & mobile

Wireframes for conversation design that works for mobile & desktop

Wireframes for conversation threads that are responsive

Wireframes for conversation threads that are responsive

Wireframes


Once I familiarized myself with Lithium's out of box components and Sephora's goals I started on mid-fidelity wireframes. Creating mid-fidelity wireframes helps me focus on the visual consistency and hierarchy before applying styles.  In these wireframes, I tried to incorporate common design component/patterns that have been successful for other communities. I also identified areas that were not covered in existing components that my require custom solutions. In my wires I included elements that directly address users' goals, needs, frustrations, and motivations.


Furthermore, to ensure users have a consistent experience across different devices, responsive wireframes are created for desktop and mobile views

Desktop Navigation

Mobile Navigation

High fidelity screens were delivered to get reactions and feedback from users


The Outcome

UI Preview

UI Preview

Final Thoughts


  • • My participation with the Sephora and Lithium team gave me a clear insight and direction to help design a feasible solution that would meet user & business needs/goals. 
  • • Lithium’s out of the box restrictions were a good exercise. already think about • reusable components but this allowed me to think more and perhaps additional ones that can be re-used and not just a one-off.
  • • Displaying the content strategically required a lot of consideration and iterations. Not all content is created equally and it can differentiate depending on the type of post. 
  • • The challenge of laying out content was a good exercise for me since I had to consider character count and hierarchy within the content. I believe this made me a more thoughtful designer.
  • • Finding a solution that scaled from desktop to mobile web + native app was a very strategic process  that required a lot discussions and strategy sessions